html,body{
			margin: 0px;
			height: 100%;
		}
		body{
			overflow: hidden;
			background:radial-gradient(circle,white,black,black,white);
			
		}
			section{
				height: 100%;
				position: relative;
				transform-style: preserve-3d;
				animation: xuanzhuan 8s linear infinite alternate;
				
				/*设置观察者的角度*/
				/*perspective-origin: 150% 50%;*/
                }
                div{
                	width: 300px;
                	height: 300px;
                	position: absolute;
                	left: calc(50% - 300px/2);
                	top: calc(50% - 300px/2)
                }
                div:nth-child(1){
                	background-image: url(img/1.JPG);
                	transform: translateY(-150px) rotateX(90deg);
                }
                div:nth-child(2){
                	background-image: url(img/2.JPG);
                	transform: translateY(150px) rotateX(90deg);
                }
                div:nth-child(3){
                	background-image: url(img/3.JPG);
                	transform: translateX(-150px) rotateY(90deg);
                }
                div:nth-child(4){
                	background-image: url(img/4.JPG);
                	transform: translateX(150px) rotateY(90deg);
                }
                div:nth-child(5){
                	background-image: url(img/5.JPG);
                	transform: translateZ(150px);
                }
                div:nth-child(6){
                	background-image: url(img/6.JPG);
                	transform: translateZ(-150px);
                }
                @keyframes xuanzhuan{
                	from{transform: rotateY(0deg) rotateX(0deg) rotateZ(0deg); }
                	to{transform: rotateY(360deg) rotateX(360deg) rotateZ(360deg);}
                }